<template>
<div>
	<fieldForm ref="fieldform"></fieldForm>
	<el-row :gutter="6">
  	<el-col :lg="4">
  		<span>中文名: </span><span>{{temp_data.ch_name}}</span>
  	</el-col>
  	<el-col :lg="4">
  		<span>英文名: </span><span>{{temp_data.en_name}}</span>
  	</el-col>
  	<el-col :lg="4">
  		<span>分组: </span><span>{{group_data.ch_name}}</span>
  	</el-col>
  	<el-col :lg="3">
  		<span>启用: </span><el-tag size="small" type="success" effect="dark">{{temp_data.enabled}}</el-tag>
  	</el-col>
  	<el-col :lg="6">
  		<span>创建时间: </span><span>{{temp_data.create_time}}</span>
  	</el-col>
  	<el-col :lg="3">
  		<el-button type="primary" size="small"  @click="showForm('添加',{})">添加字段</el-button>
  	</el-col>
	</el-row>
	<el-divider></el-divider>
	<div style="margin-top: 20px;">
		<fieldTable :fields="fields" @showForm="showForm" @getFields="getFields"></fieldTable>
	</div>
</div>
</template>
<script>
import fieldTable from './fieldTable'
import fieldForm from './fieldForm'
import {getAPItoken} from '@/utils/api'
export default {
	props: {
		temp_data: Object,
		group_data: Object
	},
	components: {
		fieldTable,
		fieldForm
	},
	data () {
		return {
			fields: []
		}
	},
	methods: {
		showForm (action,form) {
			this.$refs.fieldform.showForm(action,form)
		},
		getFields(){
      const promise = getAPItoken(API.tempField+'?template='+this.$route.query.id,this.$store.state.user.token)
      promise.then((data)=>{
        this.fields = data
      })
    }
	},
	mounted () {
		this.getFields()
	}
}
</script>
<style scoped>
span {
	color: #7a838f;
}
</style>